/* 通用选择器不建议使用 */
/* *{
    margin : 0;
    padding: 0;
} */
/* id选择器 */
#main{
    color: blue;
}
/* 类选择器 */
.news_title{
    color: aqua;
}
/* 元素选择器 */
h3{
    color: aquamarine;
}
/* 属性选择器 */
[title]{
    font-size: large;
}
p[data-bind]{
    color: bisque;
}
p[title="abc"]
{
    color: blanchedalmond;
}
p[title~="de"]
{
    color: brown;
}
p[title|="xyz"]{
    color: beige;
}
a[href][title]{
    color: aquamarine;
    font-size: smaller;
}
/* 伪类与伪元素选择器 */
p:hover{
    background-color: blueviolet;
}
li:hover{
    background-color: #465;
}
a{
    color: red;
}
a:link{
    color: blue;
}
a:visited{
    color: darkblue;
}
a:hover{
    font-weight: bold;
}
a:active{
    color: tomato;
}
input:focus{
   background-color: crimson;
}
pre:first-child{
    color: red;
}
li:first-child{
    color: red;
}
div p:first-line{
    color: slateblue;
}
div p::first-letter{
    font-weight: bold;
    font-size: 200%;
}
div h1:before{
    content: "before:";
}
div h1::after{
    content: ":after";
}
/* 组合选择器 */
div span{
    color: cornflowerblue;
}
p>span{
    color: violet;
}
pre+span{
    color: springgreen;
}
pre~span.bro{
    color: slateblue;
}